import React, { Component } from "react";
import { Row, Col, Button, Icon, Modal, message } from "antd";
import { Link } from "react-router-dom";
import "./Detail.scss";
import { releaseSAP } from "../../httpserver/api/finance.js";
import MUtil from "./../../utils/MUtil.jsx";
const _mm = new MUtil();
const dataField = [
  {
    id: "carNo",
    title: "车牌号"
  },
  {
    id: "customer",
    title: "客户名称"
  },
  {
    id: "startDateTime",
    title: "创建时间"
  },
  {
    id: "codeId",
    title: "出库单号"
  },
  {
    id: "salesman",
    title: "业务员"
  },
  {
    id: "e_post",
    title: "发货状态"
  },
  {
    id: "e_invoice",
    title: "开票状态"
  },
  {
    id: "amount",
    title: "数量"
  },
  {
    id: "cartons",
    title: "箱数"
  },
  {
    id: "e_amount",
    title: "开票金额"
  },
  {
    id: "e_balance",
    title: "客户余额"
  },
  {
    id: "forecastBalance",
    title: "差额"
  },
  {
    id: "releaseStatus",
    title: "放行状态"
  },
  {
    id: "memo",
    title: "运输方式"
  }
];
export default class Detail extends Component {
  static displayName = "Detail";

  constructor(props) {
    super(props);
    this.state = {
      data: this.props.location.data,
      userId: _mm.getStorage("userInfo").hySysUser.id || ""
    };
  }
  componentDidMount() {
    window.localStorage.setItem("carDetail", this.props.location.data);
    console.log(window.localStorage.getItem("carDetail"));
  }
  goBack() {
    this.props.history.goBack();
  }
  creatStatusDom(data) {
    if (data === "N") {
      return "未放行";
    } else if (data === "Y") {
      return "已放行";
    }
  }
  goRelease() {
    let that = this;
    Modal.confirm({
      title: "确定放行？",
      content: "",
      onCancel() {},
      onOk() {
        // console.log(222);
        releaseSAP({
          engineRecordId: that.state.data.engineRecordId,
          codeId: that.state.data.codeId,
          releaseStatus: "Y",
          operator: that.state.userId.toString()
        })
          .then(res => {
            message.success("放行成功！");
            that.goBack();
          })
          .catch(err => {
            message.error("放行失败，请重试");
          });
      },
      okText: "确定",
      cancelText: "取消"
    });
  }
  render() {
    let that = this;
    let data = this.state.data || window.localStorage.getItem("carDetail");
    return (
      <div className="detail-page">
        <div className="page-top">
          <Icon
            type="left"
            className="return-icon"
            onClick={() => {
              that.goBack();
            }}
          />
          车辆详情
        </div>
        <div className="content">
          {dataField.map((item, index) => {
            return (
              <Row className="row" key={item.id}>
                <Col span={7} className="col-left">
                  {`${item.title}  :`}
                </Col>
                <Col
                  span={17}
                  className={
                    item.id === "forecastBalance" && data.forecastBalance < 0
                      ? "col-right no-money-text"
                      : "col-right"
                  }
                >
                  {item.id === "releaseStatus"
                    ? that.creatStatusDom(data[item.id])
                    : data[item.id]}
                </Col>
              </Row>
            );
          })}
          {data.forecastBalance < 0 && (
            <img
              src={require("./../../images/no-money.png")}
              alt=""
              className="no-money-img"
            />
          )}
        </div>
        <Button
          type="primary"
          className="release-btn"
          block
          disabled={!(data.releaseStatus === "N")}
          onClick={() => {
            that.goRelease();
          }}
        >
          放行
        </Button>
      </div>
    );
  }
}
